import {messages} from "share/common";
import React, { Component } from 'react';
import { Tabs } from 'antd';
import LadderMode from 'containers/expense-reimbursement-control/new-mileage-subsidy/ladder-mode/index';
import UnitPriceMode from 'containers/expense-reimbursement-control/new-mileage-subsidy/unit-price-mode/index';

const { TabPane } = Tabs;

class NewMileageSubsidy extends Component {

  constructor(props) {
    super(props);
    this.state = {
      tabs: [
        {
          component: TabPane,
          child: UnitPriceMode,
          params: { key: 'unit', tab: messages('expense-12.key128')/*单价模式*/ }
        },
        {
          component: TabPane,
          child: LadderMode,
          params: { key: 'ladder', tab: messages('expense-12.key129')/*阶梯模式*/ }
        }
      ],
      defaultActiveKey: 'unit'
    };
  }

  componentWillMount() {
    let defaultTabKey = this.props.location && this.props.location.query && this.props.location.query.tabKey || 'unit';
    this.setState({ defaultActiveKey: defaultTabKey })
  }

  render() {
    const { tabs, defaultActiveKey } = this.state;
    return (
      <section className="mileage">
        <Tabs defaultActiveKey={defaultActiveKey}>
          {
            tabs.map(tab => React.createElement(tab.component, tab.params, React.createElement(tab.child)))
          }
        </Tabs>
      </section>
    );
  }
}

NewMileageSubsidy.propTypes = {};

export default NewMileageSubsidy;
